<template>
  <div class="app-container">

    <el-form :model="form" ref="form" label-width="160px" v-loading="formLoading" :rules="rules">
      <el-form-item label="课程类别名称：" prop="concreteName" required>
        <el-input v-model="form.concreteName"></el-input>
      </el-form-item>
    <el-form-item>
        <el-button type="primary" @click="submitForm">提交</el-button>
        <el-button @click="resetForm">重置</el-button>
      </el-form-item>

    </el-form>
    
      
  </div>
</template>

<script>
import { allCategory,selectCategory,getCategoryPageList,createCategory,deleteCategory,changeStatus} from "@/api/category/category";
import Editor from '@/components/Editor';
export default {
  inject:['reload'],
   components: {
    Editor
  },
  data() {
    return {
      form: {
        id: null,
        concreteName: "",
        categoryId: "0"
      },
      formLoading: false,
      rules: {
         concreteName: [
          { required: true, message: "请输入课程类别名称", trigger: "blur" }
        ]
      }
    }
  },
  created() {
    let id = this.$route.query.id
    let _this = this
    if (id && parseInt(id) !== 0) {
      _this.formLoading = true
      selectCategory(id).then(re => {
        _this.form = re.response
        _this.formLoading = false
      })
    }
  },
  methods: {
      submitForm () {
      let _this = this
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.formLoading = true
          createCategory(this.form).then(data => {
            if (data.code === 1) {
              _this.$message.success(data.message)
              _this.$router.push('/category/course/index')
             
            } else {
              _this.$message.error(data.message)
              _this.formLoading = false
            }
          }).catch(e => {
            _this.formLoading = false
          })
        } else {
          return false
        }
      })
    },
    resetForm () {
      this.reload()
    }
  }
};
</script>